<template>
  <el-drawer
    :title="!dataForm.id ? '新增报告' : '航班报告修改'"
    direction="rtl"
    :visible.sync="visible"
    size="90%"
    class="drawBox"
  >
    <div class="addPage">
      <el-form
        v-if="!dataForm.id"
        :inline="true"
        :model="dataForm"
        :rules="dataRule"
        label-width="130px"
        @keyup.enter.native="getDataList()"
        ref="dataForm"
      >
        <el-form-item label="航班号：" prop="FLIGHT_NUM">
          <el-input v-model="value2Computed" placeholder="请输入 " clearable></el-input>
        </el-form-item>
        <el-form-item label="航班日期：" prop="FLIGHT_DATE">
          <el-date-picker
            style="width:200px"
            v-model="dataForm.FLIGHT_DATE"
            type="date"
            value-format="yyyy-MM-dd "
            format="yyyy-MM-dd "
            placeholder="选择日期时间"
          ></el-date-picker>
        </el-form-item>

        <el-form-item>
          <el-button v-if="isAuthBtnS('extra52')" @click="getDataList()">查询</el-button>
          <el-button
            v-if="isAuthBtnS('extra54')"
            :disabled="showForm?false:true"
            type="primary"
            @click="addReport()"
          >新增</el-button>
        </el-form-item>
      </el-form>

      <div style="padding:10px 20px;text-align:right" v-if="dataForm.id">
        <el-button
          type="primary"
          size="mini"
          v-if="isAuthBtnS('extra6')&&FLIGHT_STATUS1=='0'"
          @click="report_complete_save(1)"
        >库区完成</el-button>
        <el-button
          type="primary"
          size="mini"
          v-if="isAuthBtnS('extra7')&&FLIGHT_STATUS2=='0'"
          @click="report_complete_save(2)"
        >单证完成</el-button>
        <el-button
          type="primary"
          size="mini"
          v-if="isAuthBtnS('extra8')&&FLIGHT_STATUS3=='0'"
          @click="report_complete_save(3)"
        >查询完成</el-button>
      </div>

      <div style="flex:1;overflow-y:auto;padding:0 20px" v-if="showForm">
        <el-collapse v-model="activeNames">
          <el-collapse-item title="航班基本信息" name="1" v-if="isAuthBtnS('edit')">
            <internalTab1 :formId="dataForm.id" ref="airReport" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item title="库区操作情况汇总" name="2" v-if="isAuthBtnS('extra1')">
            <internalTab2 :formId="dataForm.id" ref="airReportArea" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item title="库区特殊货物操作" name="3" v-if="isAuthBtnS('extra1')">
            <internalTab3 :formId="dataForm.id" ref="specialGoods" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item title="单证操作情况汇总" name="4" v-if="isAuthBtnS('extra2')">
            <internalTab4 :formId="dataForm.id" ref="airReportDocument" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item title="文件管理" name="5" v-if="isAuthBtnS('extra1')||isAuthBtnS('extra2')">
            <internalTab5 :formId="dataForm.id" ref="files" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item title="查询进港航班不正常清单" name="6" v-show="isAuthBtnS('extra3')">
            <internalTab6 :formId="dataForm.id" ref="abnormals" @refsherData="init" />
          </el-collapse-item>
          <el-collapse-item>
            <template slot="title">
              <i class="header-icon el-icon-info" style="color:#3699FF;margin-right:8px;"></i>
              操作日志（共{{logs.length}}条）
            </template>
            <div style="padding:20px">
              <el-table :data="logs" stripe style="width: 100%;">
                <el-table-column prop="CREATE_USER" header-align="center" align="center" label="用户"></el-table-column>
                <el-table-column prop="CONTENT" header-align="center" align="center" label="操作内容"></el-table-column>
                <el-table-column
                  prop="CREATE_TIME"
                  header-align="center"
                  show-overflow-tooltip
                  align="center"
                  label="操作时间"
                ></el-table-column>
              </el-table>
            </div>
          </el-collapse-item>
        </el-collapse>
      </div>
    </div>
  </el-drawer>
</template>

<script>
import { treeDataTranslate } from "@/utils";

import internalTab1 from "./internalTab1";
import internalTab2 from "./internalTab2";
import internalTab3 from "./internalTab3";
import internalTab4 from "./internalTab4";
import internalTab5 from "./internalTab5";
import internalTab6 from "./internalTab6";
import internalTab7 from "./internalTab7";
import internalTab8 from "./internalTab8";
import internalTab9 from "./internalTab9";

export default {
  components: {
    internalTab1,
    internalTab2,
    internalTab3,
    internalTab4,
    internalTab5,
    internalTab6,
    internalTab9,
    internalTab8,
    internalTab7
  },
  data() {
    return {
      activeNames: ["1", "2", "3", "4", "5", "6"],
      qxlist: {},
      FLIGHT_STATUS1: "",
      FLIGHT_STATUS2: "",
      FLIGHT_STATUS3: "",
      logs: [],
      reportData: {},
      dataRule: {
        FLIGHT_NUM: [
          { required: true, message: "航班号不能为空", trigger: "blur" }
        ],
        FLIGHT_DATE: [
          { required: true, message: "航班日期不能为空", trigger: "blur" }
        ]
      },
      dataForm: {
        id: "",
        FLIGHT_NUM: "",
        FLIGHT_DATE: ""
      },
      visible: false,
      showForm: false,
      activeName: "1"
    };
  },
  computed: {
    value2Computed: {
      get: function() {
        return this.dataForm.FLIGHT_NUM;
      },
      set: function(val) {
        this.dataForm.FLIGHT_NUM = val.toUpperCase();
      }
    }
  },

  methods: {
    isAuthBtnS(data) {
      return this.qxlist[data] == "1" ? true : false;
    },
    init(id, list) {
      this.qxlist = Object.assign({}, this.qxList, list);
      console.log(this.qxlist);
      this.dataForm.id = id || 0;
      this.showForm = id || 0;
      if (id) {
        this.$http({
          url: this.$http.adornUrl("/air/airReport_baseInfo?ID=" + id),
          method: "POST"
        }).then(({ data }) => {
          if (data && data.result == "1") {
            this.FLIGHT_STATUS1 = data.FLIGHT_STATUS1;
            this.FLIGHT_STATUS2 = data.FLIGHT_STATUS2;
            this.FLIGHT_STATUS3 = data.FLIGHT_STATUS3;
            sessionStorage.reportid = id;
            sessionStorage.qxlist = JSON.stringify(data.QX);
            this.qxlist = data.QX;
            this.visible = true;
            this.logs = data.logs;
            this.$nextTick(() => {
              if (this.$refs.airReport) {
                sessionStorage.flighNum = data.airReport.FLIGHT_NUM;
                sessionStorage.flighDate = data.airReport.FLIGHT_DATE;
                this.$refs.airReport.init(data.airReport);
              }
              if (this.$refs.airReportArea) {
                this.$refs.airReportArea.init(data.airReportArea);
              }
              if (this.$refs.airReportDocument) {
                this.$refs.airReportDocument.init(data.airReportDocument);
              }
              if (this.$refs.specialGoods) {
                this.$refs.specialGoods.init(data.specialGoods);
              }
              if (this.$refs.files) {
                this.$refs.files.init(data.files);
              }

              if (this.$refs.abnormals) {
                this.$refs.abnormals.init(data.abnormals);
              }
            });
          } else {
            this.$message.error(data.message);
          }
        });
      } else {
        this.visible = true;
      }
    },
    report_complete_save(type) {
      this.$http({
        url: this.$http.adornUrl("/air/report_complete_save"),
        method: "POST",
        data: this.$http.adornData({
          reportId: this.dataForm.id,
          operType: type
        })
      }).then(({ data }) => {
        if (data && data.result == "1") {
          this.$message({
            message: "操作成功",
            type: "success",
            duration: 1500,
            onClose: () => {}
          });
        } else {
          this.$message.error(data.message);
        }
      });
    },
    addReport() {
      this.$http({
        url: this.$http.adornUrl("/air/save_airReport_baseInfo"),
        method: "POST",
        data: this.$http.adornData({
          data: JSON.stringify(this.reportData)
        })
      }).then(({ data }) => {
        if (data && data.result == "1") {
          this.$message({
            message: "操作成功",
            type: "success",
            duration: 1500,
            onClose: () => {
              this.visible = false;
              this.$emit("refreshDataList");
            }
          });
        } else {
          this.$message.error(data.message);
        }
      });
    },
    getDataList() {
      this.$refs["dataForm"].validate(valid => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl("/air/search_by_airinfo"),
            method: "POST",
            data: this.$http.adornData(this.dataForm)
          }).then(({ data }) => {
            console.log(data);
            if (data && data.result == "1") {
              this.reportData = Object.assign({}, this.reportData, data);
              this.showForm = true;
              this.$nextTick(() => {
                this.$refs.specialGoods.init(data.specialGoods);
                this.$refs.files.init(data.files);

                if (this.$refs.airReport && data.airReport) {
                  sessionStorage.flighNum = data.airReport.FLIGHT_NUM;
                  sessionStorage.flighDate = data.airReport.FLIGHT_DATE;
                  this.$refs.airReport.init(data.airReport);
                }
                if (this.$refs.airReportArea && data.airReportArea) {
                  this.$refs.airReportArea.init(data.airReportArea);
                }
                if (this.$refs.airReportDocument && data.airReportDocument) {
                  this.$refs.airReportDocument.init(data.airReportDocument);
                }
                if (this.$refs.specialGoods && data.specialGoods) {
                  this.$refs.specialGoods.init(data.specialGoods);
                }
                if (this.$refs.files && data.files) {
                  this.$refs.files.init(data.files);
                }

                if (this.$refs.abnormals && data.abnormals) {
                  this.$refs.abnormals.init(data.abnormals);
                }
              });
            } else {
              this.$message.error(data.message);
            }
          });
        }
      });
    }
  }
};
</script>
<style  lang="scss" >
.drawBox {
  .el-drawer__header {
    margin-bottom: 10px;
  }
  .el-drawer__body {
    display: flex;
    overflow: hidden;
    /* background-color: #F2F2F2; */
  }
  .el-collapse-item__header {
    background-color: #f2f2f2;
    padding-left: 20px;
    padding-right: 15px;
    margin-top: 10px;
  }
}

.addPage {
  padding-top: 0;
  overflow: hidden;
  flex: 1;
  display: flex;
  flex-direction: column;
  background: #fff;
}
</style>